<template>
	<view class="addType">
		<u-navbar title="新增进件" bgColor="#fff" class="nav" :placeholder="true"
			left-text="" 
			@leftClick="onClickBack"
			:fixed="true"
			:safeAreaInsetTop="true">
			<!-- <view slot="left"></view> -->
		</u-navbar>
		
		<view class="content">
			<view class="">
				请选择商户类型
			</view>
			<view class="item w-flex w-mt-10" @click="itemChange(1)">
				<view class="icon w-mr-15">
					<u-avatar src="../../static/icon/icon_xw.png" size="40" shape="circle" @click="itemChange(1)"></u-avatar>
				</view>
				<view class="w-mr-10">
					<view class="w-font-14 title">小微商户</view>
					<view class="w-mt-10 tip">
						
						根据法律法规和相关监管规定免于办理工商注册登记、<text>无营业执照的</text>实体特约商户
					</view>
				</view>
				<view>
					<u-icon name="arrow-right" size="14" ></u-icon>
				</view>
			</view>
			<view class="item w-flex w-mt-10" @click="itemChange(2)">
				<view class="icon w-mr-15">
					<u-avatar src="../../static/icon/icon_individual.png" size="40" shape="circle" @click="itemChange(2)"></u-avatar>
				</view>
				<view class="w-mr-10">
					<view class="w-font-14 title">个体工商户</view>
					<view class="w-mt-10 tip">
						
						营业执照上的主体类型一般为<text>个体户、个体工商户、个体营业</text>
					</view>
				</view>
				<view>
					<u-icon name="arrow-right" size="14" ></u-icon>
				</view>
			</view>
			<view class="item w-flex w-mt-10" @click="itemChange(3)">
				<view class="icon w-mr-15">
					<u-avatar src="../../static/icon/icon_enterprise.png" size="40" shape="circle" @click="itemChange(3)"></u-avatar>
				</view>
				<view class="w-mr-10">
					<view class="w-font-14 title">企业商户</view>
					<view class="w-mt-10 tip">
						营业执照上的主体类型一般为<text>有限公司、有限责任公司</text>
					</view>
				</view>
				<view>
					<u-icon name="arrow-right" size="14" ></u-icon>
				</view>
			</view>
		</view>
		<u-modal :show="dialog.show" @confirm="confirmDialog" :closeOnClickOverlay="true" @close="close">
			<view slot="default" class="dialogStyle">
				<view v-if="dialog.type === 1" class="title">
					进件小微商户
				</view>
				<view v-else-if="dialog.type === 2" class="title">
					进件个体商户
				</view>
				<view v-else class="title">
					进件企业商户
				</view>
				<view class="tip">
					您需要提前准备一下资料
				</view>
				<view>
					<view class="w-flex condition w-mt-5" v-if="dialog.type !== 1">
						<u-icon class="w-mr-5" name="checkmark-circle" size="12" color="#1678ff"></u-icon>
						<text>营业执照</text>
					</view>
					<view class="w-flex condition w-mt-5" v-for="(item, index) in dialog.condition" :key="index">
						<u-icon class="w-mr-5" name="checkmark-circle" size="12" color="#1678ff"></u-icon>
						<text>{{item.name}}</text>
					</view>
				</view>
			</view>
			
		</u-modal>
	</view>
</template>

<script>
export default {
	data() {
		return {
			typeList: [
				{
					title: '小微商户',
					tip: '根据法律法规和相关监管规定免于办理工商注册登记、<text>无营业执照的</text>实体特约商户'
				}
			],
			dialog: {
				show: false,
				type: 1,
				condition: [
					{
						name: '商户证件'
					},
					{
						name: '商户结算卡'
					},
					{
						name: '店铺经营信息'
					}
				]
			}
		}
	},
	onLoad() {
		
	},
	methods: {
		// 返回页面
		onClickBack () {
			uni.navigateBack()
		},
		itemChange (type) {
			this.dialog.type = type
			this.dialog.show = true
		},
		confirmDialog () {
			this.dialog.show = false
			uni.removeStorageSync("contactInfo")
			uni.removeStorageSync("payCard")
			uni.removeStorageSync("legalPerson")
			uni.removeStorageSync("licenseInfo")
			uni.removeStorageSync("accountInfo")
			uni.removeStorageSync("baseInfo")
			uni.removeStorageSync("addressInfo")
			uni.removeStorageSync("UnionPayRate")
			uni.removeStorageSync("ScanCodeRate")
			uni.removeStorageSync("shopInfo")
			uni.navigateTo({
				url: './MerchantForm?type='+this.dialog.type
			})
		},
		close () {
			this.dialog.show = false
		}
	}
}
</script>

<style lang="scss" scoped>
.addType {
	position: absolute;
	width: 100%;
	height: 100%;
	color: #000;
	font-family: '微软雅黑';
	.content {
		padding: 20rpx 40rpx;
		.item {
			background: #FFFFFF;
			border-radius: 20rpx;
			padding: 40rpx;
			font-size: 12px;
			.icon {
				width: 80rpx;
				height: 80rpx;
			}
			.title {
				font-weight: 600;
			}
			.tip {
				font-family: "微软雅黑";
				text {
					color: #1678ff;
				}
			}
		}
		
	}
	.dialogStyle {
		text-align: center;
		font-size: 12px;
		.title {
			font-size: 18px;
			color: #000;
			font-weight: 600;
		}
		.tip {
			color: #B1b1b1;
			margin-top: 15rpx;
			margin-bottom: 30rpx;
		}
		.condition {
			padding-left: 40rpx;
		}
	}
}

</style>
